<template>
  <BasicModal v-bind="$attrs" @register="registerModal" destroyOnClose :title="getTitle" :width="650" @ok="handleSubmit">
    <a-form ref="formRef" :model="formData" :label-col="labelCol" :wrapper-col="wrapperCol">
      <a-row>
        <a-col :span="24">
          <a-form-item label="样品编号" name="samNum">
            <a-input v-model:value="formData.samNum" :disabled="true"></a-input>
          </a-form-item>
        </a-col>
        <a-col :span="24">
          <a-form-item label="样品名称" name="samName">
            <a-input v-model:value="formData.samName" :disabled="true"></a-input>
          </a-form-item>
        </a-col>
        <a-col :span="24">
          <a-form-item label="样品外观" name="samAppear">
            <a-input v-model:value="formData.samAppear" :disabled="true"></a-input>
          </a-form-item>
        </a-col>
        <a-col :span="24">
          <a-form-item label="回收日期" name="backDate">
            <a-date-picker valueFormat="YYYY-MM-DD" v-model:value="formData.backDate" :disabled="false"
              style="width: 100%;" />
          </a-form-item>
          <a-form-item label="存样周期（月）" name="stockCycle">
            <a-input-number v-model:value="formData.stockCycle" :min="1" style="width: 100%" :disabled="false" />
          </a-form-item>
        </a-col>
        <a-col :span="24">
          <a-form-item label="回收备注" name="backRemark">
            <a-textarea v-model:value="formData.backRemark" />
          </a-form-item>
        </a-col>
      </a-row>
    </a-form>
  </BasicModal>
</template>

<script lang="ts" setup>
import { ref, reactive } from 'vue';
import { BasicModal, useModalInner } from '/@/components/Modal';
import { sampleBack } from '../LabSample.api';

// Emits声明
const emit = defineEmits(['register', 'success']);
const labelCol = reactive({
  xs: { span: 24 },
  sm: { span: 5 },
});
const wrapperCol = reactive({
  xs: { span: 24 },
  sm: { span: 16 },
});
const getTitle = ref('样品回收');
const formData = reactive({
  id: "",
  samNum: "",
  samName: "",
  model: "",
  lotNum: "",
  samDate: "",
  samAppear: "",
  backDate: "",
  backRemark: "",
  samStatus: "",
  stockCycle: "",
});


function reset() {
  formData.id = '';
  formData.samNum = '';
  formData.samName = '';
  formData.model = '';
  formData.samDate = '';
  formData.lotNum = '';
  formData.backDate = "";
  formData.samDate = '';
  formData.backRemark = '';
  formData.samStatus = '';
  formData.stockCycle = '';
}

const [registerModal, { closeModal, setModalProps }] = useModalInner((data) => {
  setModalProps({
    minHeight: 150
  });
  reset();
  Object.assign(formData, data.record);
  if (data.record.samNum.includes("JH") || data.record.samNum.includes("CH")) {
    formData.stockCycle = '12';
  }else{
    formData.stockCycle = '2';
  }

});



//表单提交事件
async function handleSubmit() {
  try {
    //提交表单
    await sampleBack(formData);
    //关闭弹窗
    closeModal();
    //刷新列表
    emit('success');
  } finally {
    setModalProps({ confirmLoading: false });
  }
}
</script>

<style lang="less" scoped>
/** 时间和数字输入框样式 */
:deep(.ant-input-number) {
  width: 100%
}

:deep(.ant-calendar-picker) {
  width: 100%
}
</style>